<template>
  <div class="app-container">
      <!-- <el-form :model="selectForm" ref="selectForm" :inline="true">
      <el-form-item label="计划单号">
        <el-input v-model="selectForm.planCode" placeholder="请输入计划单号" clearable size="small"/>
      </el-form-item>
      <el-form-item label="创建日期">
        <el-date-picker v-model="date" size="small" value-format="yyyy-MM-dd"
                        type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
                        @change="dateSelect"></el-date-picker>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="selectForm.pageNum=1;getList">搜索
        </el-button>
      </el-form-item>
    </el-form> -->
      <!-- 采购计划审批  获取当前用户可以审批的数据-->
    <el-table v-loading="loading" :data="list" border>
      <el-table-column align="center" type="index" label="序号" width="55"/>
      <el-table-column align="center" label="计划单号" property="itemCode" width="150">
        <template slot-scope="scope" style="text-align: center">
            <!-- v-hasPermi="['purchaseGL:notDone:details']" -->
          <el-button size="mini" type="text" @click="details(scope.row)" >
            {{scope.row.itemCode}}
          </el-button>
        </template>
      </el-table-column>
      <el-table-column align="center" label="标题" property="itemTitle" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column label="申请时间" align="center" property="applyTime" r width="180">
      </el-table-column>
      <el-table-column align="center" label="创建人" property="applyUserName"></el-table-column>
      <el-table-column align="center" label="备注" property="itemContent" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column label="操作" align="center" width="450" fixed="right">
        <template slot-scope="scope">
          
          <el-button v-if="/spot_check/.test(roles)" size="mini" type="success" icon="el-icon-refresh-left" @click="approval(scope.row,true)">重新申请</el-button>
          <el-button v-if="/spot_check/.test(roles)" size="mini" type="info" icon="el-icon-close" @click="approval(scope.row,false)">取消申请</el-button>

          <el-button v-if="/captain|technician/.test(roles)" size="mini" type="success" icon="el-icon-check" @click="approvalFuc(scope.row,true)">审批同意</el-button>
          <el-button v-if="/captain|technician/.test(roles)" size="mini" type="danger" icon="el-icon-close" @click="approvalFuc(scope.row,false)">驳回</el-button>
          <el-button size="mini" type="warning" icon="el-icon-date" @click="openHisChange(scope.row)">审批历史</el-button>
          <el-button size="mini" type="primary" icon="el-icon-picture-outline" @click="openImgChange(scope.row)">进度查看</el-button>
        </template>
      </el-table-column>
    </el-table> 
        <pagination :total="total" :page.sync="selectForm.pageNum" :limit.sync="selectForm.pageSize" @pagination="getList"/>
        <el-dialog
      title="提示"
      :visible.sync="isApproval"
      width="40%">
      <div>
        <el-form>
          <el-form-item label="备注">
            <el-input type="textarea" v-model="form.comment" :rows="8"></el-input>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="isApproval = false">取 消</el-button>
        <el-button type="primary" @click="approval(info.row,info.falg,form)">确 定</el-button>
      </span>
    </el-dialog>
    <history-dia v-if="isHisDia" :info="hisInfo" @change="closeHisChange"></history-dia>
    <image-dia v-if="isImgDia" :info="imgInfo" @change="closeImgChange"></image-dia>
    <inspection-des v-if="isinspecDes" @subSetChane="subSetChane" :pid="pid"></inspection-des>
  </div>
</template>

<script>
  import { approvePoll,approve} from '@/api/Inspection/index'
  import historyDia from './historyDia'
  import imageDia from './imageDia'
  import inspectionDes from '@/views/components/inspectionJHXQ'
export default {
    components:{
        historyDia,
        imageDia,
        inspectionDes
    },
    data(){
        return{
            selectForm:{
                pageNum:1,
                pageSize:10
            },
            loading:false,
            list:[],
            total:0,
            roles:this.$store.state.user.roles.join(','),
            isHisDia:false,
            hisInfo:null,
            isImgDia:false,
            imgInfo:null,

            isinspecDes:false,
            pid:null,

            isApproval:false,
            info:null,
            form:{}
        }
    },
    created(){
        this.getList()
    },
    methods:{
        getList(){
            this.loading = true
            approvePoll(this.selectForm).then((res)=>{
                if(res.code==200){
                    this.list = res.rows
                    this.total=res.total
                    this.loading = false
                }
            })
           
        },
        approvalFuc(row,falg){
          this.isApproval=true
          this.info={row,falg}
          this.form={}
        },
        approve(info){
            approve(info).then((res)=>{
                if(res.code==200){
                    this.$message.success(res.msg)
                    this.isApproval=false
                    this.info=null
                    this.form={}
                    this.getList()
                }
            })
        },
        approval(row,falg,info){
            this.$confirm('是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
                }).then(() => {
                  if(info){
                    this.approve({taskId:row.taskId,agree:falg,moduleId:row.moduleId,instanceId:row.instanceId,...info})
                  }else{
                    this.approve({taskId:row.taskId,agree:falg,moduleId:row.moduleId,instanceId:row.instanceId})
                  }
                }).catch(() => {
                    this.$message({
                    type: 'info',
                    message: '已取消'
                });          
            });
        },
        details(row) {
          // this.$router.push({path:'/inspectionGL/inspectionJHXQ',query:{data:row.moduleId}});
            this.pid=row.id
            this.isinspecDes=true
        },
        subSetChane(){
            this.isinspecDes=false
            this.pid=null
        },
        openHisChange(row){
            this.hisInfo=row
            this.isHisDia=true

        },
        openImgChange(row){
            this.imgInfo=row
            this.isImgDia=true

        },
        closeHisChange(info){
            if(info){

            }
            this.isHisDia=false
        },
        closeImgChange(info){
            if(info){

            }
            this.isImgDia=false
        },
    }
}
</script>

<style>

</style>